<template>
  <div class="app-container home">

    <el-card class="update-log">
      <div slot="header" class="clearfix">
        <span>运行参数</span>
      </div>
      <div class="body">
        <p>
          <i class="el-icon-s-promotion"/>联系信息：
          <input v-model="params.contect" placeholder="联系信息" clearable>
          <el-button style="margin-left: 10px" type="primary" size="small"
                     @click="updataParam('contect',params.contect)">修改
          </el-button>
        </p>
        <p>
          <i class="el-icon-s-promotion"/>新用户注册赠送额度：
          <input v-model="params.newUserPrice" placeholder="赠送额度" clearable>
          <el-button style="margin-left: 10px" type="primary" size="small"
                     @click="updataParam('newUserPrice',params.newUserPrice)">修改
          </el-button>
        </p>
        <p>
          <i class="el-icon-s-promotion"/>拉新用户（一位）赠送额度：
          <input v-model="params.pullUserPrice" placeholder="赠送额度" clearable>
          <el-button style="margin-left: 10px" type="primary" size="small"
                     @click="updataParam('pullUserPrice',params.pullUserPrice)">修改
          </el-button>
        </p>
        <p>
          <i class="el-icon-s-promotion"/> 查询页用户须知是否默认勾选：
          <el-switch
            @change="updataParam('checked',params.checked)"
            v-model="params.checked"
            active-color="#13ce66"
            inactive-color="#ff4949">
          </el-switch>
        </p>

      </div>
    </el-card>

    <el-divider/>
    <el-card class="update-log">
      <div slot="header" class="clearfix">
        <span>用户意见</span>
      </div>
      <div class="body">
        <el-table  v-loading="loading"  :data="opinions">
          <el-table-column width="50" label="单号" align="center" prop="id"/>
          <el-table-column width="180" label="openID" align="center" prop="openId"/>
          <el-table-column width="90" label="姓名" align="center" prop="name"/>
          <el-table-column width="110" label="联系方式" align="center" prop="relation"/>
          <el-table-column width="260" label="问询信息" align="center" prop="opinionText"/>
          <el-table-column width="260" label="回复信息" align="center">
            <template slot-scope="scope">
              {{ scope.row.replyText }}
              <el-button
                type="primary"
                size="mini"
                @click="isShow=true;title='回复'+scope.row.name;opinion.id = scope.row.id;opinionText=scope.row.opinionText">
                {{ scope.row.replyText == null ? '' : '修改' }}回复
              </el-button>
            </template>
          </el-table-column>
          <el-table-column width="100" label="更新时间" align="center" prop="updataTime"/>
          <el-table-column width="100" label="问询时间" align="center" prop="createTime"/>
        </el-table>

        <pagination
          v-show="total>0"
          :total="total"
          :page.sync="queryParams.pageNum"
          :limit.sync="queryParams.pageSize"
          @pagination="getList"/>
      </div>
    </el-card>
    <el-dialog :title="title" :visible.sync="isShow">
      <h6 style="line-height: 60px"><span>问询信息：</span>{{ opinionText }}</h6>
      <el-form :model="opinion" size="medium" label-width="80px">
        <el-form-item label="回复信息">
          <el-input type="textarea" v-model="opinion.replyText"></el-input>
        </el-form-item>
      </el-form>
      <div slot="footer">
        <el-button @click="isShow=!isShow">取消</el-button>
        <el-button type="primary" @click="updataoPinion()">确定</el-button>
      </div>
    </el-dialog>

  </div>
</template>

<script>
  import {getLP, getParams, getOpinions, updataParam,updataOpinion} from "@/api/weiChat";

  import Cookies from "js-cookie";

  export default {
    data() {
      return {
        loading: true,
        title: '',
        isShow: false,
        params: {
          contect: '',
          newUserPrice: '',
          pullUserPrice: '',
          checked: ''
        },
        // 查询参数
        queryParams: {
          pageNum: 1,
          pageSize: 10,
        },
        total: 0,
        opinions: [],

        opinionText: null,
        opinion: {
          id: null,
          replyText: null
        }
      }
    },
    created() {
      if (Cookies.get('jfT') == undefined) {
        getLP().then(res => {
          Cookies.set('jfT', res.data)
        })
      }
      getParams().then((res) => {
        if (res.code == 1000) {
          this.params = res.data
        }
      })
      this.getList()
    },

    methods: {

      updataParam(key, param) {
        updataParam({
          key, param
        }, Cookies.get('jfT')).then((res) => {
          if (res.code == 1000) {
            this.$modal.msgSuccess("修改成功")
            this.getCombos()
            this.isConboShow = false
          }
        })
      },

      getList() {
        this.loading = true
        getOpinions(this.queryParams, Cookies.get('jfT')).then((res) => {
          this.opinions = res.data.records
          this.total = res.data.total
          this.loading = false
        })
      },

      updataoPinion(){
        updataOpinion(this.opinion, Cookies.get('jfT')).then((res) => {
          if (res.code == 1000) {
            this.$modal.msgSuccess("回复成功")
            this.getList()
            this.isShow = false
          }
        })
      }
    }
  };
</script>

<style scoped lang="scss">
  .home {
    font-family: "open sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 13px;
    color: #676a6c;
    overflow-x: hidden;

    p {
      margin-top: 10px;

      b {
        font-weight: 700;
      }
    }

    .update-log {
      ol {
        display: block;
        list-style-type: decimal;
        margin-block-start: 1em;
        margin-block-end: 1em;
        margin-inline-start: 0;
        margin-inline-end: 0;
        padding-inline-start: 40px;
      }
    }
  }
</style>

